// 抽离出来的 TabBar 组件
import 'package:flutter/material.dart';

class BasicTabBar extends StatelessWidget {
  const BasicTabBar({super.key});
  @override
  Widget build(BuildContext context) {
    /* 
    DefaultTabController 会自动把tabbar  和 tabbarview进行关联 无须显示绑定
    
     */
    return DefaultTabController(
      length: 3,
      child: Scaffold(
        appBar: AppBar(
          //   automaticallyImplyLeading: false, // 隐藏返回按钮
          backgroundColor: Colors.transparent, // 使 AppBar 透明
          elevation: 1, // 显示/移除 AppBar 的阴影
          // 这里配置的是顶部tabbar  
          //   bottom: const TabBar(
          //     tabs: [
          //       Tab(icon: Icon(Icons.directions_car)),
          //       Tab(icon: Icon(Icons.directions_transit)),
          //       Tab(icon: Icon(Icons.directions_bike)),
          //     ],
          //   ),
          //   title: const Text('Tabs Demo'),
        ),
        body: const TabBarView(
          // 禁止滑动的配置
          physics: NeverScrollableScrollPhysics(), 
          children: [
            Icon(Icons.directions_car),
            Icon(Icons.directions_transit),
            Icon(Icons.directions_bike),
          ],
        ),
        bottomNavigationBar: Container(
          decoration: const BoxDecoration(
            border: Border(
              top: BorderSide(
                color: Color(0xFFCCCCCC), // 设置边框颜色为 #ccc
                width: 0.5, // 边框宽度
              ),
            ),
          ),
          child: const TabBar(
            tabs: [
              Tab(icon: Icon(Icons.directions_car)),
              Tab(icon: Icon(Icons.directions_transit)),
              Tab(icon: Icon(Icons.directions_bike)),
            ],
          ),
        ),
      
      ),
    );
  }
}
